import { Line } from '@ant-design/plots';
import { PageContainer } from '@ant-design/pro-components';

const AccessPage: React.FC = () => {
  // const [data, setData] = useState([]);

  // useEffect(() => {
  //   asyncFetch();
  // }, []);

  const config = {
    data: [
      {
        department: '门诊部',
        value: 10,
        hospital: '浙一医院',
      },
      {
        department: '门诊部',
        value: 15,
        hospital: '九和医院',
      },
      {
        department: '急诊部',
        value: 16,
        hospital: '浙一医院',
      },
      {
        department: '急诊部',
        value: 25,
        hospital: '九和医院',
      },
    ],
    xField: 'department',
    yField: 'value',
    seriesField: 'hospital',
    xAxis: {},
  };

  // const asyncFetch = () => {
  //   fetch(
  //     'https://gw.alipayobjects.com/os/bmw-prod/55424a73-7cb8-4f79-b60d-3ab627ac5698.json',
  //   )
  //     .then((response) => response.json())
  //     .then((json) => setData(json))
  //     .catch((error) => {
  //       console.log('fetch data failed', error);
  //     });
  // };

  return (
    <PageContainer
      ghost
      header={{
        title: 'Echarts',
      }}
    >
      <h4>门诊部和急诊部人数统计</h4>
      <Line {...config} />
    </PageContainer>
  );
};

export default AccessPage;
